<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  </head>
<body class="CFJS_Layout_974center">
  <div id="CFJS_OverlayInit" style="display: none;">
    <h1>CFJS Sample Appliction</h1>
    <p>Please wait ... CFJS Form loading.</p>
  </div>
  <div id="CFJS_Page">
    <h2>CFJS Form</h2><span id="version">4.4.0</span>
    <a href="..">&lt;&lt;back</a><!-- CFJS 4.4.0.61 --><p class="CFJS_FormHelp">This is the form information text.</p>
<div class="containerSection cfjs-section" id="mainFormSection"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Main Form</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div id="mainFormSectionDrawer" class="cfjs-drawer"><div class="cfjs-drawerContentContainer" style="display: none;"><div class="cfjs-drawerContent" style="display: block;">
    NOTE: The messages name must be unique.  If there are name collisions, the behavior of the app is unknown and this is NOT SUPPORTED.
    <p class="CFJS_FormHelp">
      rules: { nonTypeDate: { customError: { name:"fillOtherField", message:"{0} : fill in Auto Complete too.", customMethod: function(value, ele) { return ($("#auto").val() !== ""); } } }, ...}
    </p>
    <p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">Custom Error: A custom error (red text + icon) triggered onblur and form submit.  When validation method returns false will act just like built-in validators (onblur/in-line, onsubmit/top of form).</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("customError", field, name, message, method, {event: ['blur',etc], display: ['both','inline','form']});</p>
    <p class="CFJS_FormHelp">Custom Warning: Is a custom warning (black text) triggered on event (onblur by default).  When validation method returns false will show message in-line.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("customWarning", field, name, message, method, {event: ['blur',etc]});
    </p><p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">* These rules can be established in the rules object (preferred) or using CFJS_Form().</p>
    <hr class="CFJS_SectionDivider">
    <p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">Show Error: show an error by messageName or pass message to show on-the-fly.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("showInlineError",field, messageName, [message]);
    </p><p class="CFJS_FormHelp">Show Warning: show a warning by messageName or pass message to show on-the-fly.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("showInlineWarning",field, messageName, [message]);
    </p><p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">Hide Error: hide an error by messageName.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("hideInlineError",field, messageName);
    </p><p class="CFJS_FormHelp">Hide Warning: hide a warning by messageName.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("hideInlineWarning",field, messageName);
  </p></div><div class="cfjs-drawerLoading" style="display: none;">Loading...please wait.</div><div class="cfjs-drawerError CFJS_ErrorText" style="display: none;"></div></div><div class="cfjs-drawerTab"><div class="cfjs-drawerTabLeft">&nbsp;</div><div class="cfjs-drawerTabTextContainer"><div class="cfjs-drawerTabText">Just in time help</div> <div class="cfjs-drawerControl">&nbsp;</div></div><div class="cfjs-drawerTabRight">&nbsp;</div></div><div style="clear: both;"></div></div><div class="cfjs-sectionContent">
  <form method="get" action="data/sampleConfig.js" id="form1" class="cfjs-form" onsubmit="return false;">
    <div id="form1Errors" class="cfjs-formErrors"><div class="cfjs-formErrorsHeader">Please correct these errors:</div><ul></ul></div>
    <div id="container"></div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="firstName">First Name <span class="CFJS_FormExample">(Ex: John)</span>
        <span class="cfjs-formErrorLabel"></span><input type="text" class="CFJS-FormNameField testClass" id="firstName" name="firstName">
      </label>

      <label for="lastName"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Last Name <span class="CFJS_FormExample">(Ex: Smith)</span>
        <span class="cfjs-formErrorLabel"></span><input type="text" class="CFJS_FormLastName testClass" id="lastName" name="lastName" maxlength="12">
      </label>

      <label for="num"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Numeric
        <span class="cfjs-formErrorLabel"></span><input type="text" class="CFJS_FormName testClass" id="num" name="num">
      </label>

      <label for="password">Password
        <span class="cfjs-formErrorLabel"></span><input type="password" id="password" name="password" maxlength="12">
      </label>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="email"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Email
        <span class="cfjs-formErrorLabel"></span><input type="text" id="email" name="email" class="cfjs-formEmailField">
      </label>

      <label for="email2">Email (Not required)
        <span class="cfjs-formErrorLabel"></span><input type="text" id="email2" name="email2" class="cfjs-formEmailField">
      </label>

      <label for="questions2"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Questions 2
        <span class="cfjs-formErrorLabel"></span><select class="reqTest" id="questions2" name="questions2"><option></option>
          <option>From HTML1</option>
        <option value="What is your favorite color 2?">What is your favorite color 2?</option><option value="What is you least favorite color 2?">What is you least favorite color 2?</option></select>
      </label>

      <label for="questions3"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Questions 3
        <select class="reqTest" id="questions3" name="questions3"><option></option>
          <option>From HTML1</option>
          <option>From HTML2</option>
        <option value="CFJS_Other">Other</option></select>
      </label><label for="form1questions3Other" style="display: none;">Other <span class="CFJS_FormExample">(please specify)</span><span class="cfjs-formErrorLabel"></span><input type="text" name="form1questions3Other" id="form1questions3Other" class="cfjs-selectOther"></label>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="ssn"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Soc. Sec. No.
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formSsnField" id="ssn" name="ssn">
      </label>

      <label for="ssn2"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Soc. Sec. No. <span class="CFJS_FormExample">(full mask)</span>
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formSsnField" id="ssn2" name="ssn2">
      </label>

      <label for="phone"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Phone number
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formPhoneField" id="phone" name="phone">
      </label>

      <label for="phoneExt">Phone number Ext
        <span class="cfjs-formErrorLabel"></span><input type="text" id="phoneExt" name="phoneExt" class="cfjs-formPhoneExtField">
      </label>

      <label for="taxid"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Tax ID Number
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formTaxIdField" id="taxid" name="taxid">
      </label>

      <label for="taxid2"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Tax ID Number <span class="CFJS_FormExample">(full mask)</span>
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formTaxIdField" id="taxid2" name="taxid2">
      </label>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="zip5">Zip code 5
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formZip5Field" id="zip5" name="zip5">
      </label>

      <label for="zip9">Zip code 9
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formZip9Field" id="zip9" name="zip9">
      </label>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="textarea">Textarea
        <span class="cfjs-formErrorLabel"></span><span class="CFJS_FormExample">(1500 characters) <span id="cfjs-formTextareaCounter-textarea"></span></span><textarea name="textarea" id="textarea" maxlength="1500"></textarea>
      </label>

      <fieldset id="stackedRadios1">
        <legend><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Stacked Radios<span class="cfjs-formErrorLabel" for="stackedRadios1"></span></legend>
        <label for="radioDefault1" class="CFJS_Stacked inline">
          <input type="radio" value="default1" name="stackedRadios1" id="radioDefault1">
          Default
        </label>
        <label for="radioNext1" class="CFJS_Stacked inline">
          <input type="radio" value="next1" name="stackedRadios1" id="radioNext1">
            Next
        </label>
        <label for="radioPrev1" class="CFJS_Stacked inline">
          <input type="radio" value="prev1" name="stackedRadios1" id="radioPrev1">
          Previous
        </label>
      </fieldset>

      <fieldset id="stackedChecks1" maxlength="2">
        <legend><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Stacked Checks<span class="cfjs-formErrorLabel" for="stackedChecks1"></span></legend>
        <label for="checkDefault1" class="CFJS_Stacked inline">
          <input type="checkbox" value="default1" name="stackedChecks1" id="checkDefault1">
          Default
        </label>
        <label for="checkNext1" class="CFJS_Stacked inline">
          <input type="checkbox" value="next1" name="stackedChecks1" id="checkNext1">
            Next
        </label>
        <label for="checkPrev1" class="CFJS_Stacked inline">
          <input type="checkbox" value="prev1" name="stackedChecks1" id="checkPrev1">
          Previous
        </label>
      </fieldset>

      <label for="beginDate"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Begin Date
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formDateField hasDatepicker" id="beginDate" name="beginDate"><div title="Calendar" class="cfjs-formDatePicker" style="margin-top: -22px; margin-left: 76px; margin-right: 10px;"></div>
      </label>

      <label for="questions"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Questions
        <span class="cfjs-formErrorLabel"></span><select class="reqTest" id="questions" name="questions"><option></option>
        <option value="12342342423">What is your favorite color?</option><option value="9879823">What is you least favorite color?</option></select>
      </label>

       <label for="endDate"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>End Date
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formDateField hasDatepicker" id="endDate" name="endDate"><div title="Calendar" class="cfjs-formDatePicker" style="margin-top: -22px; margin-left: 76px; margin-right: 10px;"></div>
      </label>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="auto"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Auto Complete
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest ui-autocomplete-input" id="auto" name="auto" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true">
      </label>
      <label for="file">File
        <span class="cfjs-formErrorLabel"></span><input type="file" id="file" name="file" size="63">
      </label>

      <label for="nonTypeDate_5ebb7a82-801e-2b1b-d756-c4bb2f69971e"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Non-Typeable Date
        <span class="cfjs-formErrorLabel"></span><input type="text" class="reqTest cfjs-formDateField hasDatepicker" id="nonTypeDate_5ebb7a82-801e-2b1b-d756-c4bb2f69971e" name="nonTypeDate_5ebb7a82-801e-2b1b-d756-c4bb2f69971e"><div title="Calendar" class="cfjs-formDatePicker" style="margin-top: -22px; margin-left: 76px; margin-right: 10px;"></div>
      </label>
      <label for="nonTypeDate2Months">Non-Typeable Date <span class="CFJS_FormExample">(2 months)</span>
        <span class="cfjs-formErrorLabel"></span><input type="text" id="nonTypeDate2Months" name="nonTypeDate2Months" class="cfjs-formDateField hasDatepicker"><div title="Calendar" class="cfjs-formDatePicker" style="margin-top: -22px; margin-left: 76px; margin-right: 10px;"></div>
      </label>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="textarea2">Textarea 2
        <span class="cfjs-formErrorLabel"></span><span class="CFJS_FormExample">(25 characters) <span id="cfjs-formTextareaCounter-textarea2">0</span></span><textarea rows="5" maxlength="25" name="textarea2" id="textarea2"></textarea>
      </label>
      <label for="textarea3">Textarea 3
        <span class="cfjs-formErrorLabel"></span><span class="CFJS_FormExample">(30 characters) <span id="cfjs-formTextareaCounter-textarea3">0</span></span><textarea rows="4" name="textarea3" id="textarea3" maxlength="30"></textarea>
      </label>

      <fieldset id="stackedRadios2">
        <legend>Stacked Radios<span class="cfjs-formErrorLabel" for="stackedRadios2"></span></legend>
        <label for="radioDefault2" class="CFJS_Stacked inline">
          <input type="radio" value="default2" name="stackedRadios2" id="radioDefault2">
          Default
        </label>
        <label for="radioNext2" class="CFJS_Stacked inline">
          <input type="radio" value="next2" name="stackedRadios2" id="radioNext2">
            Next
        </label>
        <label for="radioPrev2" class="CFJS_Stacked inline">
          <input type="radio" value="prev2" name="stackedRadios2" id="radioPrev2">
          Previous
        </label>
      </fieldset>

      <fieldset id="stackedChecks2">
        <legend>Stacked Checks<span class="cfjs-formErrorLabel" for="stackedChecks2"></span></legend>
        <label for="checkDefault2" class="CFJS_Stacked inline">
          <input type="checkbox" value="default2" name="stackedChecks2" id="checkDefault2">
          Default
        </label>
        <label for="checkNext2" class="CFJS_Stacked inline">
          <input type="checkbox" value="next2" name="stackedChecks2" id="checkNext2">
            Next
        </label>
        <label for="checkPrev2" class="CFJS_Stacked inline">
          <input type="checkbox" value="prev2" name="stackedChecks2" id="checkPrev2">
          Previous
        </label>
      </fieldset>
    </div>

    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <fieldset id="inlineRadios2">
        <legend><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Inline Radios<span class="cfjs-formErrorLabel" for="inlineRadios2"></span></legend>
        <label for="radioDefault2" class="inline">
          <input type="radio" value="default2" name="inlineRadios2" id="radioDefault2">
          Default
        </label>
        <label for="radioNext2" class="inline">
          <input type="radio" value="next2" name="inlineRadios2" id="radioNext2">
            Next
        </label>
        <label for="radioPrev2" class="inline">
          <input type="radio" value="prev2" name="inlineRadios2" id="radioPrev2">
          Previous
        </label>
      </fieldset>

      <fieldset id="inlineChecks2">
        <legend>Inline Checks</legend>
        <label for="checkDefault2" class="inline">
          <input type="checkbox" value="default2" name="inlineChecks2" id="checkDefault2">
          Default
        </label>
        <label for="checkNext2" class="inline">
          <input type="checkbox" value="next2" name="inlineChecks2" id="checkNext2">
            Next
        </label>
        <label for="checkPrev2" class="inline">
          <input type="checkbox" value="prev2" name="inlineChecks2" id="checkPrev2">
          Previous
        </label>
      </fieldset>

      <label for="timeTest">Time
        <span class="cfjs-formErrorLabel"></span><span class="timeEntry_wrap"><input type="text" class="reqTest cfjs-formTimeField hasTimeEntry" id="timeTest" name="timeTest"></span>
      </label>

      <label for="time24Test">Time <span class="CFJS_FormExample">(24 hours)</span>
        <span class="cfjs-formErrorLabel"></span><span class="timeEntry_wrap"><input type="text" class="reqTest cfjs-formTime24HourField hasTimeEntry" id="time24Test" name="time24Test"></span>
      </label>

      <label for="timeTestSeconds">Time <span class="CFJS_FormExample">with Seconds</span>
        <span class="cfjs-formErrorLabel"></span><span class="timeEntry_wrap"><input type="text" class="reqTest cfjs-formTimeSecondsField hasTimeEntry" id="timeTestSeconds" name="timeTestSeconds"></span>
      </label>
    </div>

    <div id="requiredText" class="cfjs-formRequiredContainer"><span class="cfjs-formRequiredLabel">*</span>Required information</div>

    <div class="CFJS_ButtonSet">
      <div id="submit1" class="cfjs-button" tabindex="0" title="Submit test" style="width: 60px;"><div class="cfjs-buttonLeft"></div><div class="cfjs-buttonContent cfjs-buttonDoubleHeight" style="width: 40px;">SUBMIT<br>TEST</div><div class="cfjs-buttonRight"></div></div>
      <!-- <button onclick="javascript:document.execCommand('SaveAs','1','fileName.txt')">Click to save</Button> -->
    </div>
  </form>

  <hr class="CFJS_SectionDivider">
  <div id="mainFormOptionsSection" class="cfjs-sectionSub"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Form Options</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
    <ul class="CFJS_Clear tests">
      <li><a id="showError" href="javascript:void(0)">Change error message</a></li>
      <li><a id="showError2" href="javascript:void(0)">Show custom error</a></li>
      <li><a id="loadAutocomplete" href="javascript:void(0)">Load auto complete</a></li>
      <li><a id="loadObject" href="javascript:void(0)">Load object</a></li>
      <li><a id="resetForm" href="javascript:void(0)">Reset form</a></li>
      <li><a id="destroyForm" href="javascript:void(0)">Destroy form</a></li>
      <li><a id="createForm" href="javascript:void(0)">Create form</a></li>
      <li><a id="hideSSN" href="javascript:void(0)">Hide SSN</a></li>
      <li><a id="showSSN" href="javascript:void(0)">Show SSN</a></li>
    </ul>
  </div></div></div>
  <hr class="CFJS_SectionDivider">
  <div id="mainFormPropertiesSection" class="cfjs-sectionSub"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Getters / Setters</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
    <ul class="CFJS_Clear tests">
      <li><a id="setSSN" href="javascript:void(0)">Set SSN</a></li>
      <li><a id="setSSN2" href="javascript:void(0)">Set SSN (full mask)</a></li>
      <li><a id="getSSN" href="javascript:void(0)">Get SSN</a></li>
      <li><a id="getSSN2" href="javascript:void(0)">Get SSN (full mask)</a></li>
      <li><a id="setTaxId" href="javascript:void(0)">Set TaxId</a></li>
      <li><a id="setTaxId2" href="javascript:void(0)">Set TaxId (full mask)</a></li>
      <li><a id="getTaxId" href="javascript:void(0)">Get TaxId</a></li>
      <li><a id="getTaxId2" href="javascript:void(0)">Get TaxId (full mask)</a></li>
      <li><a id="setPhone" href="javascript:void(0)">Set Phone</a></li>
      <li><a id="getPhone" href="javascript:void(0)">Get Phone</a></li>
      <li><a id="setEndDate" href="javascript:void(0)">Set End Date</a></li>
      <li><a id="getEndDate" href="javascript:void(0)">Get End Date</a></li>
      <li><a id="setTextarea2" href="javascript:void(0)">Set Textarea2</a></li>
      <li><a id="getChecks" href="javascript:void(0)">Get Stacked Checks 1 (enable debugging first)</a></li>
      <li><a id="getRadios" href="javascript:void(0)">Get Stacked Radios 1 (enable debugging first)</a></li>
      <li><a id="setChecks" href="javascript:void(0)">Set Stacked Checks 1</a></li>
      <li><a id="setRadios" href="javascript:void(0)">Set Stacked Radios 1</a></li>
    </ul>
  </div></div></div>
  <hr class="CFJS_SectionDivider">
  <div id="mainFormRulesSection" class="cfjs-sectionSub"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Field Rules</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
    <ul class="CFJS_Clear tests">
      <li><a id="setMinTextLength" href="javascript:void(0)">Set Min Text Length</a></li>
      <li><a id="setMinTextLength2" href="javascript:void(0)">Set Min Text Length2</a></li>
      <li><a id="setMinDate" href="javascript:void(0)">Set Min Date</a></li>
      <li><a id="setMaxDate" href="javascript:void(0)">Set Max Date</a></li>
      <li><a id="setDateDisabledDays" href="javascript:void(0)">Set Date Disable Days</a></li>
      <li><a id="getFieldRules" href="javascript:void(0)">Get Field Rules (enable debugging first)</a></li>
      <li><a id="setRequired" href="javascript:void(0)">Set Textarea required</a></li>
      <li><a id="setRequiredFalse" href="javascript:void(0)">Set Textarea required FALSE</a></li>
      <li><a id="setClassOptional" href="javascript:void(0)">Set Class optional</a></li>
    </ul>
  </div></div></div>
  <hr class="CFJS_SectionDivider">
  <div id="mainFormDisableSection" class="cfjs-sectionSub"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Disable</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
    <ul class="CFJS_Clear tests">
      <li><a id="setDisabledLastName" href="javascript:void(0)">Disable Last Name</a></li>
      <li><a id="setDisabledLastNameFALSE" href="javascript:void(0)">Disable Last Name FALSE</a></li>
      <li><a id="setDisabledEndDate" href="javascript:void(0)">Disable End Date</a></li>
      <li><a id="setDisabledEndDateFALSE" href="javascript:void(0)">Disable End Date FALSE</a></li>
      <li><a id="setDisabledQuestions2" href="javascript:void(0)">Disable Questions2</a></li>
      <li><a id="setDisabledQuestions2FALSE" href="javascript:void(0)">Disable Questions2 FALSE</a></li>
      <li><a id="setDisabledTextarea" href="javascript:void(0)">Disable Textarea</a></li>
      <li><a id="setDisabledStackedRadios2" href="javascript:void(0)">Disable Stacked Radios 2</a></li>
      <li><a id="setDisabledCheckNext2" href="javascript:void(0)">Disable CheckNext2</a></li>
      <li><a id="setDisabledRadioPrev2" href="javascript:void(0)">Disable RadioPrev2</a></li>
      <li><a id="setDisabledAuto" href="javascript:void(0)">Disable Auto</a></li>
    </ul>
  </div></div></div>
  <hr class="CFJS_SectionDivider">
  <div id="mainFormInlineSection" class="cfjs-sectionSub"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Inline Errors / Warnings</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
    <ul class="CFJS_Clear tests">
      <li><a id="setCustomValidatorZipCode" href="javascript:void(0)">Setup Zip5 Custom Validator</a></li>
      <li><a id="setCustomWarningZipCode" href="javascript:void(0)">Setup Zip5 Custom Warning</a></li>
      <li><a id="showFlyWarning" href="javascript:void(0)">Show on-the-fly Inline Warning</a></li>
      <li><a id="showFlyError" href="javascript:void(0)">Show on-the-fly Inline Error</a></li>
      <li><a id="showCustomError" href="javascript:void(0)">Show Inline Message (must already exist)</a></li>
      <li><a id="hideFlyWarning" href="javascript:void(0)">Hide Inline Message</a></li>
    </ul>
  </div></div></div>

  <div style="display:none" id="inlineMsgHelp">
    NOTE: The messages name must be unique.  If there are name collisions, the behavior of the app is unknown and this is NOT SUPPORTED.
    <p class="CFJS_FormHelp">
      rules: { nonTypeDate: { customError: { name:"fillOtherField", message:"{0} : fill in Auto Complete too.", customMethod: function(value, ele) { return ($("#auto").val() !== ""); } } }, ...}
    </p>
    <p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">Custom Error: A custom error (red text + icon) triggered onblur and form submit.  When validation method returns false will act just like built-in validators (onblur/in-line, onsubmit/top of form).</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("customError", field, name, message, method, {event: ['blur',etc], display: ['both','inline','form']});</p>
    <p class="CFJS_FormHelp">Custom Warning: Is a custom warning (black text) triggered on event (onblur by default).  When validation method returns false will show message in-line.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("customWarning", field, name, message, method, {event: ['blur',etc]});
    </p><p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">* These rules can be established in the rules object (preferred) or using CFJS_Form().</p>
    <hr class="CFJS_SectionDivider">
    <p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">Show Error: show an error by messageName or pass message to show on-the-fly.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("showInlineError",field, messageName, [message]);
    </p><p class="CFJS_FormHelp">Show Warning: show a warning by messageName or pass message to show on-the-fly.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("showInlineWarning",field, messageName, [message]);
    </p><p class="CFJS_FormHelp">&nbsp;</p>
    <p class="CFJS_FormHelp">Hide Error: hide an error by messageName.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("hideInlineError",field, messageName);
    </p><p class="CFJS_FormHelp">Hide Warning: hide a warning by messageName.</p>
    <p class="CFJS_FormHelp">|___ CFJS_Form("hideInlineWarning",field, messageName);
  </p></div>
</div></div></div>

<div class="containerSection cfjs-section" id="additionalFormSection"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Additional Form</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
  <p class="CFJS_FormHelp">This form was to test issues with where the error container is defined.</p>
  <form id="form2" class="cfjs-form" onsubmit="return false;">
    <div id="swseErrorContainer" class="cfjs-formErrors"><div class="cfjs-formErrorsHeader">Please correct these errors:</div><ul></ul></div>
    <div class="CFJS_InformationText">Choose a date range</div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="swseBeginDate"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Begin date
        <span class="cfjs-formErrorLabel"></span><input type="text" name="swseBeginDate" id="swseBeginDate" class="cfjs-formDateField hasDatepicker"><div title="Calendar" class="cfjs-formDatePicker" style="margin-top: -22px; margin-left: 76px; margin-right: 10px;"></div>
      </label>
      <label for="swseEndDate"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>End date
        <span class="cfjs-formErrorLabel"></span><input type="text" name="swseEndDate" id="swseEndDate" class="cfjs-formDateField hasDatepicker"><div title="Calendar" class="cfjs-formDatePicker" style="margin-top: -22px; margin-left: 76px; margin-right: 10px;"></div>
      </label>
    </div>
    <div id="swseRequiredText" class="cfjs-formRequiredContainer"><span class="cfjs-formRequiredLabel">*</span>Required information</div>
  </form>
  <div class="CFJS_ButtonSet">
    <div id="swseSubmitButton" class="cfjs-button" tabindex="0" title="Submit" style="width: 60px;"><div class="cfjs-buttonLeft"></div><div class="cfjs-buttonContent" style="width: 40px;">SUBMIT</div><div class="cfjs-buttonRight"></div></div>
  </div>
</div></div></div>

<div class="containerSection cfjs-section" id="disappearingFormSection"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Disappearing Form</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo"></div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
  <p class="CFJS_FormHelp">This form was to test some disappearing elements after validation</p>
  <div id="chaContactInfoPopUpHouseholdSectionErrors" class="cfjs-formErrors"><div class="cfjs-formErrorsHeader">Please correct these errors:</div><ul></ul></div>
  <form id="form3" class="cfjs-form" onsubmit="return false;">
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="cha_contactInfo_address"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Address
        <span class="cfjs-formErrorLabel"></span><input type="text" maxlength="200" name="cha_contactInfo_address" id="cha_contactInfo_address">
      </label>
      <label for="cha_contactInfo_city"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>City
        <span class="cfjs-formErrorLabel"></span><input type="text" maxlength="50" name="cha_contactInfo_city" id="cha_contactInfo_city">
      </label>
    </div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="state">State
        <span class="cfjs-formErrorLabel"></span><select name="cha_contactInfo_state" id="cha_contactInfo_state"><option></option></select>
      </label>
      <label for="cha_contactInfo_zip">Zip code
        <span class="cfjs-formErrorLabel"></span><input type="text" name="cha_contactInfo_zip" id="cha_contactInfo_zip" class="cfjs-formZip9Field">
      </label>
      <label for="cha_contactInfo_country"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Country
        <span class="cfjs-formErrorLabel"></span><select name="cha_contactInfo_country" id="cha_contactInfo_country"><option></option></select>
      </label>
      <label for="cha_contactInfo_province">Province
        <span class="cfjs-formErrorLabel"></span><select name="cha_contactInfo_province" id="cha_contactInfo_province"><option></option></select>
      </label>
    </div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="cha_contactInfo_salutation">Salutation (Example: Doug and Jane)
        <span class="cfjs-formErrorLabel"></span><input type="text" name="cha_contactInfo_salutation" id="cha_contactInfo_salutation">
      </label>
    </div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="cha_contactInfo_envelopeName">Envelope name (Example: Mr. and Mrs. Doug Smith)
        <span class="cfjs-formErrorLabel"></span><input type="text" name="cha_contactInfo_envelopeName" id="cha_contactInfo_envelopeName">
      </label>
    </div>
    <div class="CFJS_ButtonSet">
      <span class="cfjs-formErrorLabel"></span><div id="chaSubmitButton" class="cfjs-button" tabindex="0" title="Submit" style="width: 60px;"><div class="cfjs-buttonLeft"></div><div class="cfjs-buttonContent" style="width: 40px;">SUBMIT</div><div class="cfjs-buttonRight"></div></div>
    </div>
  </form>
</div></div></div>

<div class="containerSection cfjs-section" id="selectSection"><div class="cfjs-sectionHeader"><div title="Expand/Collapse" alt="Expand/Collapse" class="cfjs-sectionControl cfjs-sectionExpanded"></div><div class="cfjs-sectionTitle">Select Boxes</div><div class="cfjs-sectionHeaderSpinner cfjs-spinner cfjs-spinnerSmall" style="display: none;"></div><div class="cfjs-sectionInfo">Parent/Child, LOV and other select boxes</div></div><div class="cfjs-sectionSpinner cfjs-spinner" style="display: none;"></div><div class="CFJS_ErrorText cfjs-sectionError" style="display: none;"></div><div class="cfjs-sectionContentContainer"><div class="cfjs-sectionContent">
  <div id="selectFormErrors" class="cfjs-formErrors"><div class="cfjs-formErrorsHeader">Please correct these errors:</div><ul></ul></div>
  <form id="selectForm" class="cfjs-form" onsubmit="return false;">
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="parent">Parent
        <span class="cfjs-formErrorLabel"></span><select id="parent" name="parent">
        <option value="4">Four</option><option value="5">Five</option><option value="6">Six</option></select>
      </label>
      <label for="child">Child
        <span class="cfjs-formErrorLabel"></span><select id="child" name="child"><option></option><option value="41">41</option><option value="441">441</option><option value="4441">4441</option><option value="44441">44441</option><option value="444441">444441</option></select>
      </label>
      <label for="grandchild">Grandchild
        <span class="cfjs-formErrorLabel"></span><select id="grandchild" name="grandchild"><option></option></select>
      </label>
    </div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="lov">LOV
        <span class="cfjs-formErrorLabel"></span><select id="lov" name="lov"><option value="value1-1">name1-1</option><option value="value1-2">name1-2</option><option value="value1-3">name1-3</option><option value="value1-4">name1-4</option><option value="value1-5">name1-5</option></select>
      </label>
      <label for="lovParent">LOV Parent
        <span class="cfjs-formErrorLabel"></span><select id="lovParent" name="lovParent"><option value="value1-1">name1-1</option><option value="value1-2">name1-2</option><option value="value1-3">name1-3</option><option value="value1-4">name1-4</option><option value="value1-5">name1-5</option></select>
      </label>
      <label for="lovChild">LOV Child
        <span class="cfjs-formErrorLabel"></span><select id="lovChild" name="lovChild" style="width: 150px;"><option value="value2-1">name2-1</option><option value="value2-2">name2-2</option><option value="value2-3">name2-3</option></select>
      </label>
    </div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="leadType"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Lead Type
        <span class="cfjs-formErrorLabel"></span><select id="leadType" name="leadType"><option></option><option value="Advertising">Advertising</option><option value="Internet">Internet</option><option value="Local Marketing Event">Local Marketing Event</option><option value="Mortgage Data Cards">Mortgage Data Cards</option><option value="Other">Other</option><option value="Prospecting Assist">Prospecting Assist</option><option value="Referral">Referral</option><option value="Representative Direct Mail">Representative Direct Mail</option><option value="Seminars">Seminars</option><option value="Telemarketing">Telemarketing</option></select>
      </label>
      <label for="leadSource"><div class="cfjs-formRequiredLabel" style="display: block;">*</div>Lead Source
        <span class="cfjs-formErrorLabel"></span><select id="leadSource" name="leadSource"><option></option></select>
      </label>
    </div>
    <div class="CFJS_FormRow"><ul class="cfjs-formRowInlineMessages"></ul>
      <label for="other">Other Test
        <select id="other" name="other"><option></option><option value="1">One</option><option value="2">Two</option><option value="3">Three</option><option value="CFJS_Other">Other</option></select>
      </label><label for="selectFormotherOther" style="display: none;">Other <span class="CFJS_FormExample">(please specify)</span><span class="cfjs-formErrorLabel"></span><input type="text" name="selectFormotherOther" id="selectFormotherOther" class="cfjs-selectOther"></label>
    </div>
    <div class="CFJS_ButtonSet">
      <div id="selectSubmitButton" class="cfjs-button" tabindex="0" title="Submit" style="width: 60px;"><div class="cfjs-buttonLeft"></div><div class="cfjs-buttonContent" style="width: 40px;">SUBMIT</div><div class="cfjs-buttonRight"></div></div>
    </div>
  </form>
</div></div></div>
</div>
<script src="../scripts/cfjs-4.4.0-min.js" type="text/javascript"></script>
<!-- CFJS 4.4.0.61 --><script type="text/javascript">
  $(function() {
    $.CFJS_Config("load", "data/sampleConfig.js", LoadLovs);

    function LoadLovs() {
      $.CFJS_Config("loadLov", ["LEAD_SOURCE_CC", "CONTACT_ROLE", "STATE_ABBREV_CF"], { url: $.CFJS_Config("get", "lovUrl") }, { complete: initSelectForm } );
    };

    function initSelectForm() {
      $selectForm = $("#selectForm").CFJS_Form({
        errorContainer: "selectFormErrors",
        rules: {
          lov: {
            options: $.CFJS_Config("lov", "lov1")
          },
          lovParent: {
            options: $.CFJS_Config("lov", "lov1")
          },
          lovChild: {
            parent: "lovParent",
            minWidth: 150,
            options: $.CFJS_Config("lov", "lov1", { children: true })
          },
          leadType: {
            required: true,
            blankOption: true,
            options: $.CFJS_Config("lov", "LEAD_SOURCE_CC")
          },
          leadSource: {
            required: true,
            parent: "leadType",
            minWidth: 50,
            maxWidth: 190,
            blankOption: true,
            options: $.CFJS_Config("lov", "LEAD_SOURCE_CC", { children: true })
          },
          parent: {
            options: [{ name: "Four", value: "4" }, { name: "Five", value: "5" }, { name: "Six", value: "6" } ]
          },
          child: {
            parent: "parent",
            blankOption: true,
            options: { "4": ["41", "441", "4441", "44441", "444441"], "5": ["51", "551", "5551"], "6": [ { name: "Six1", value: "6" }, { name: "Six Six1", value: "66" }, { name: "Six Six Six1", value: "666" } ] }
          },
          grandchild: {
            parent: "child",
            blankOption: true,
            options: { "41": ["Quattro1", "Quattro2", "Quattro3"], "551": ["Cinco1", "Cinco2", "Cinco3"], "666": [ { name: "Seis1", value: "6" }, { name: "Seis2", value: "66" }, { name: "Seis3", value: "666" } ] }
          },
          other: {
            blankOption: true,
            other: true,
            options: [{ name: "One", value: "1" }, { name: "Two", value: "2" }, { name: "Three", value: "3" } ]
          }
        }
      });
      $("#selectSection").CFJS_Section({ info: "Parent/Child, LOV and other select boxes" });
      $("#selectSubmitButton").CFJS_Button({ click: function () { $selectForm.CFJS_Form("validate"); } });
    }

    var formOptions = {
      errorContainer: "form1Errors",
      async: true,
      //enter: function() { $.CFJS_Console("log", "Enter pressed in form"); },
      enter: { valid: function() { $.CFJS_Console("log", "valid"); }, invalid: function() { $.CFJS_Console("log", "invalid"); } },
      defaultFocus: 'lastName',
      rules: {
        firstName: {
          filter: "alpha",
          oneAndOneMoreRequired: "lastName,num"
        },
        logme: { },
        lastName: {
          required: true,
          minLength: 4,
          maxLength: 12,
          filter: "name" //,
          //change: function(val, e) { $.CFJS_Console("log", "Last Name value is now: " + ((val.target) ? val.target.value : val.originalTarget.value)); }
        },
        num: { filter: "num" },
        password: {
          required: function(ele) { if ($.trim($("#email2").val()) !== "") { return true; } else { return false; } },
          minLength: 8,
          filter: /[a-z]/i,
          maxLength: 12
        },
        email: {
          required: true,
          minLength: 10,
          email: true
        },
        email2: {
          email: true
        },
        ssn: {
          required: true,
          ssn: true
        },
        ssn2: {
          required: true,
          ssn: true,
          fullMask: true
        },
        textarea: {
          counter: false
        },
        taxid: {
          required: true,
          taxId: true
        },
        taxid2: {
          required: true,
          taxId: true,
          fullMask: true
        },
        beginDate: {
          //defaultDate: { days: -1 },
          defaultDate: "today",
          minDate: '09/15/2010',
          required: true,
          maxDate: { years: 1},
          date: true,
          customWarning: {
            name:"simpleWarning",
            message:"Testing my warning onblur.",
            customMethod: function(value, ele) {
              return false;
            }
          }
        },
        endDate: {
          defaultDate: 'today',
          required: true,
          date: true,
          months: 3,
          //minDate: "09/15/2010",
          maxDate: '10/11/2010',
          //minDate: {days:0},
          disableDays: [0, 4]
        },

        nonTypeDate2Months: {
          date: true,
          defaultDate: "09/07/2006",
          months: 2,
          calendarOnly: true
        },
        phone: {
          required: true,
          phone: true,
          validPhoneNumber: 'phone',
          ext: false
        },

        phoneExt: {
          phone: true
        },
        zip5: {
          zip: true,
          format: 5
        },
        zip9: {
          zip: true
        },
        questions: {
          required: true,
          blankOption: true,
          options: [
            { name: "What is your favorite color?", value: "12342342423"},
            null,
            { name: "What is you least favorite color?", value: "9879823"},
            null,
            null
          ]
        },
        questions2: {
          required: true,
          blankOption: true,
          options: [
            "What is your favorite color 2?",
            "What is you least favorite color 2?"
          ]
        },
        questions3: {
          required: true,
          blankOption: true,
          other: true
        },
        textarea3: {
          maxLength: 30
        },
        auto: {
          required: true,
          autocomplete: true,
          data: ['Doll, Jeff', 'Martin, Vince', 'VanLaningham, Shea', 'Mouse, Mickey', 'Woods, Tiger', 'Duck, Donald']
        },
        file: {
          //required: true
        },
        stackedChecks1: {
          required: true,
          minLength: 2,
          maxLength: 2
        },
        stackedRadios1: {
          required: true,
          change: function() { $.CFJS_Console("log", "changed radio value"); }
        },
        stackedChecks2: {
          stacked: true
        },
        stackedRadios2: {
          stacked: true
        },
        inlineRadios2: {
          required: true
        },
        timeTest: {
          time: true,
          //defaultTime: "05:17 PM"
          defaultTime: "now"
        },
        time24Test: {
          time: true,
          defaultTime: "15:15",
          show24Hours: true
        },
        timeTestSeconds: {
          time: true,
          seconds: true,
          interval: [1,15,1],
          defaultTime: "04:05:30 am"
        }
      },
      messages: {
        email: {
          required: "Please enter your &lt;u&gt;email address&lt;/u&gt;.",
          email: "Please enter a valid &lt;u&gt;email address&lt;/u&gt;."
        },
        password: {
          required: "Please enter your &lt;u&gt;password&lt;/u&gt;.",
          minLength: $.format("&lt;u&gt;Password&lt;/u&gt; requires at least {0} characters.")
        }
      }
    };

    formOptions.rules["nonTypeDate_5ebb7a82-801e-2b1b-d756-c4bb2f69971e"] = {
      required: true,
      date: true,
      calendarOnly: true,
      disableDays: [0, 2, 4, 6],
      minDate : jQuery.CFJS_Util("formatDate"),
      customError: {
        name:"fillOtherField",
        message:"{0} : fill in Auto Complete too.",
        customMethod: function(value, ele) {
          return ($("#auto").val() !== "");
        }
      }
    }

    $form1 = $("#form1").CFJS_Form("hide", "ssn"); // This should log an error.  Form is not created yet.

    $("#submit1").CFJS_Button({ click: function() {
      $('#form1').CFJS_Form("submit", { data: { test: 'test' }, valid: function() { alert('valid'); }/*, invalid: function() { alert("There be some errors"); }*/ });
    } });

    $('#form1').CFJS_Form(formOptions).CFJS_Form("show", "ssn");

    $("#nonTypeDate2Months").change(function() {  //THIS IS NOT FIRING.
      $("#form1").CFJS_Form("val", "textarea3", "");
      $("#form1").CFJS_Form("loadOptions", "questions3",[] );
      return false;
    });

    $('#form1').CFJS_Form("load",{"nonTypeDate_5ebb7a82-801e-2b1b-d756-c4bb2f69971e":"10/10/2010"});

    $("#showError").click(function() { $("#form1").CFJS_Form("showError", 'lastName', 'Change the last name message.'); } );
    $("#showError2").click(function() { $("#form1").CFJS_Form("showError", 'another error.'); } );
    $("#loadAutocomplete").click(function() { $("#form1").CFJS_Form("loadOptions", "auto", ['Another, Name', 'Additional, Also'], true); $("#form1").CFJS_Form("loadOptions", "questions3", ['Another, Name', 'Additional, Also'], true); });
    $("#loadObject").click(function() { $("#form1").CFJS_Form("load", {blahBlah: "Blah", firstName: 'John', lastName: 'Smith', noRules: 'Test', email: 'email@emails.com', password: 'testpassword', ssn: '123456789', taxid: '354490504', phone: "3098213935" })});
    $("#resetForm").click(function() { $("#form1").CFJS_Form("reset"); } );
    $("#setSSN").click(function() { $("#form1").CFJS_Form("val", "ssn", "223456789"); } );
    $("#setSSN2").click(function() { $("#form1").CFJS_Form("val", "ssn2", "987654322"); } );
    $("#getSSN").click(function() { alert($("#form1").CFJS_Form("val", "ssn")); } );
    $("#getSSN2").click(function() { alert($("#form1").CFJS_Form("val", "ssn2")); } );
    $("#setTaxId").click(function() { $("#form1").CFJS_Form("val", "taxid", "223451234"); } );
    $("#setTaxId2").click(function() { $("#form1").CFJS_Form("val", "taxid2", "987654321"); } );
    $("#getTaxId").click(function() { alert($("#form1").CFJS_Form("val", "taxid")); } );
    $("#getTaxId2").click(function() { alert($("#form1").CFJS_Form("val", "taxid2")); } );

    $("#setPhone").click(function() { $("#form1").CFJS_Form("val", "phone", "8005559595"); } );
    $("#getPhone").click(function() { alert($("#form1").CFJS_Form("val", "phone")); } );
    $("#setEndDate").click(function() { $("#form1").CFJS_Form("val", "endDate", "09302010"); } );
    $("#getEndDate").click(function() { alert($("#form1").CFJS_Form("val", "endDate")); } );
    $("#setRequired").click(function() { $("#form1").CFJS_Form("required", "textarea", true); } );
    $("#setRequiredFalse").click(function() { $("#form1").CFJS_Form("required", "textarea", false); } );
    $("#setClassOptional").click(function() { $("#form1").CFJS_Form("required", { className: "reqTest" }, false); } );
    $("#hideSSN").click(function() { $("#form1").CFJS_Form("hide", "ssn"); } );
    $("#showSSN").click(function() { $("#form1").CFJS_Form("show", "ssn"); } );
    $("#setTextarea2").click(function() { $("#form1").CFJS_Form("val", "textarea2", "akljal;skdjflakjsdaklja25l;skdjflakjsd"); } );
    $("#getChecks").click(function() { $.CFJS_Console("log", $("#form1").CFJS_Form("val", "stackedChecks1")); });
    $("#getRadios").click(function() { $.CFJS_Console("log", $("#form1").CFJS_Form("val", "stackedRadios1")); });
    $("#setChecks").click(function() { $("#form1").CFJS_Form("val", "stackedChecks1", ["next1","default1"]); });
    $("#setRadios").click(function() { $("#form1").CFJS_Form("val", "stackedRadios1", "next1"); });
    $("#destroyForm").click(function() { $("#form1").CFJS_Form("destroy"); } );
    $("#createForm").click(function() { $("#form1").CFJS_Form(dynamicOptions); } );
    $("#setMinTextLength").click(function() { $("#form1").CFJS_Form("rules", "textarea2", {minLength:5}); } );
    $("#setMinTextLength2").click(function() { $("#form1").CFJS_Form("rules", "firstName", {minLength:3}); } );
    $("#setMinDate").click(function() { $("#form1").CFJS_Form("rules", "endDate", {minDate:"09/15/2010"}); } );
    $("#setMaxDate").click(function() { $("#form1").CFJS_Form("rules", "endDate", {maxDate:"09/30/2010"}); } );
    $("#setDateDisabledDays").click(function() { $("#form1").CFJS_Form("rules", "beginDate", {disableDays:[2, 4, 6]}); } );
    $("#getFieldRules").click(function() { $.CFJS_Console("log", $("#form1").CFJS_Form("rules", "endDate")); } );
    $("#setDisabledLastName").click(function() { $("#form1").CFJS_Form("disabled", "lastName", true); } );
    $("#setDisabledLastNameFALSE").click(function() { $("#form1").CFJS_Form("disabled", "lastName", false); } );
    $("#setDisabledEndDate").click(function() { $("#form1").CFJS_Form("disabled", "endDate", true); } );
    $("#setDisabledEndDateFALSE").click(function() { $("#form1").CFJS_Form("disabled", "endDate", false); } );
    $("#setDisabledQuestions2").click(function() { $("#form1").CFJS_Form("disabled", "questions2", true); } );
    $("#setDisabledQuestions2FALSE").click(function() { $("#form1").CFJS_Form("disabled", "questions2", false); } );
    $("#setDisabledTextarea").click(function() { $("#form1").CFJS_Form("disabled", "textarea", true); } );
    $("#setDisabledStackedRadios2").click(function() { $("#form1").CFJS_Form("disabled", "stackedRadios2", true); } );
    $("#setDisabledCheckNext2").click(function() { $("#form1").CFJS_Form("disabled", "checkNext2", true); } );
    $("#setDisabledRadioPrev2").click(function() { $("#form1").CFJS_Form("disabled", "radioPrev2", true); } );
    $("#setDisabledAuto").click(function() { $("#form1").CFJS_Form("disabled", "auto", true); } );

    $("#setCustomValidatorZipCode").click(function() { $("#form1").CFJS_Form("customError", "zip5", "NoHollywood", "{0} cannot be 90210.",
        function(value, ele) { return (value !== "90210"); }, {display:"form"});
      } );
    $("#setCustomWarningZipCode").click(function() { $("#form1").CFJS_Form("customWarning", "zip5", "tooCloseToHome", "Seriously? You want {0} to have a Bloomington zip?",
        function(value, ele) { return (value !== "61704"); });
      } );
    $("#showCustomError").click(function() { $("#form1").CFJS_Form("showInlineError", "nonTypeDate_5ebb7a82-801e-2b1b-d756-c4bb2f69971e", "fillOtherField"); } );
    $("#showFlyWarning").click(function() { $("#form1").CFJS_Form("showInlineWarning", "zip5", "flyZipWarning", "I wouldn't do that."); } );
    $("#showFlyError").click(function() { $("#form1").CFJS_Form("showInlineError", "zip5", "thisIsImportant", "What are you doing?"); } );
    $("#hideFlyWarning").click(function() { $("#form1").CFJS_Form("hideInlineWarning", "zip5", "flyZipWarning"); } );

    $("#mainFormSection").CFJS_Section({ drawer: { content: { id:"inlineMsgHelp" } } });
    $('#mainFormOptionsSection').CFJS_Section({ type: "subsection" });
    $('#mainFormPropertiesSection').CFJS_Section({ type: "subsection" });
    $('#mainFormDisableSection').CFJS_Section({ type: "subsection" });
    $('#mainFormRulesSection').CFJS_Section({ type: "subsection" });
    $('#mainFormInlineSection').CFJS_Section({ type: "subsection" });

    var dynamicOptions = {
      errorContainer: "form1Errors",
      enter: function() { $.CFJS_Console("log", "Enter pressed in dynamic form"); },
      defaultFocus: 'text',
      createMarkup: true,
      async: true,
      markupContainer: "container",
      rules: {
        regexFilter: {
          type: "text",
          label: "Regular Expression Filter",
          filter: /[a-g]/i,
          width: 200
        },
        alphanumFilter: {
          type: "text",
          label: "Alphanum Filter",
          required: true,
          maxLength: 4,
          width: 72,
          filter: /[a-z0-9]/i,
          change: function(val, e) { $.CFJS_Console("log", "Last Name value is now: " + ((val.target) ? val.target.value : val.originalTarget.value)); },
          breakAfter: false
        },
        numFilter: {
          type: "text",
          label: "Num Filter",
          filter: /[0-9]/i
        },
        alphaFilter: {
          type: "text",
          label: "Alpha Filter",
          filter: /[a-z]/i,
          breakAfter: true,
          width: 300
        },
        date: {
          type: "date",
          label: "Date",
          width: 200, // Should not work...don't allow changing width of standard types.
          required: true
        },
        minMaxDate: {
          type: "date",
          label: "Min/Max Date",
          minDate: "08/02/2010",
          maxDate: "08/29/2010"
        },
        zip: {
          type: "zip",
          label: "Zip code"
        },
        select: {
          type: "select",
          label: "Select",
          options: ["One", "Two", "Three" ]
        },
        selectOther: {
          type: "select",
          label: "Select Other",
          blankOption: true,
          breakAfter: true,
          required: true,
          width: 100,
          other: true,
          options: [{ name: "Uno", value: "1" }, { name: "Dos", value: "2" }, { name: "Tres", value: "3" } ]
        },
        selectDependantParent2: {
          type: "select",
          required: true,
          width: 200,
          label: "Select Parent",
          options: [{ name: "Four", value: "4" }, { name: "Five", value: "5" }, { name: "Six", value: "6" } ]
        },
        selectDependant2: {
          type: "select",
          label: "Select Child",
          //width: 150,
          blankOption: true,
          required: true,
          minWidth: 100,
          maxWidth: 200,
          parent: "selectDependantParent2",
          options: { "4": ["42", "442", "4442", "44442", "444442"], "5": ["52", "552", "5552"], "6": [ { name: "Six2", value: "6" }, { name: "Six Six2", value: "66" }, { name: "Six Six Six2", value: "666" } ] }
        },
        checkboxes1: {
          type: "checkboxes",
          label: "Checkboxes 1",
          required: true,
          stacked: true,
          change: function() { $.CFJS_Console("log", "changed checkbox value"); },
          options: ["One", "Two", "Three" ]
        },
        checkboxes2: {
          type: "checkboxes",
          label: "Checkboxes 2",
          width: 350,
          options: [{ name: "Uno", value: "1" }, { name: "Dos", value: "2" }, { name: "Tres", value: "3" } ]
        }
      }
    };

    var customDateRangeOptions = {
      errorContainer: "swseErrorContainer",
      requiredContainer: "swseRequiredText",
      rules: {
        swseBeginDate: {
          required: true,
          date: true
        },
        swseEndDate: {
          required: true,
          date: true
        }
      }
    };

    var $form2 = jQuery("#form2").CFJS_Form(customDateRangeOptions);
    var $submitButton = jQuery("#swseSubmitButton").CFJS_Button({ click: function() { $form2.CFJS_Form("validate"); } });
    $("#additionalFormSection").CFJS_Section();

    var contactInfoHouseholdFormOptions = {
      //errorContainer: "chaContactInfoPopUpHouseholSectionErrors",
      errorContainer: "chaContactInfoPopUpHouseholdSectionErrors",
      rules: {
        cha_contactInfo_address: {
          required: true
        },
        cha_contactInfo_city: {
          required : true
        },
        cha_contactInfo_state: {
          nameIndex: 'option',
          valueIndex: 'val',
          blankOption: true,
          required: false
        },
        cha_contactInfo_zip: {
          zip: true
        },
        cha_contactInfo_country: {
          nameIndex: 'option',
          valueIndex: 'val',
          blankOption: true ,
          required: true
        },
        cha_contactInfo_province: {
          nameIndex: 'option',
          valueIndex: 'val' ,
          blankOption: true,
          required: function (el) { return false; }
        }
      }
    };

    var $form3= jQuery('#form3').CFJS_Form(contactInfoHouseholdFormOptions);
    var $submitButton3 = jQuery("#chaSubmitButton").CFJS_Button({ click: function() {
      $form3.CFJS_Form("validate", {
          valid: function () {
            $.CFJS_Console("log", "valid");
          },
          invalid: function () {
            $.CFJS_Console("log", "invalid");
          }
        });
      }
    });
    $("#disappearingFormSection").CFJS_Section();

    $.CFJS_Overlay("hide");
  });
</script>


<div style="display: none; z-index: 1000; outline: 0px none;" class="ui-dialog ui-widget ui-widget-content ui-corner-all  ui-draggable" tabindex="-1" role="dialog" aria-labelledby="ui-dialog-title-cfjs-errorPopup"><div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" unselectable="on" style="-moz-user-select: none;"><span class="ui-dialog-title" id="ui-dialog-title-cfjs-errorPopup" unselectable="on" style="-moz-user-select: none;">&nbsp;</span><a href="#" class="ui-dialog-titlebar-close ui-corner-all" role="button" unselectable="on" style="-moz-user-select: none;"><span class="ui-icon ui-icon-closethick" unselectable="on" style="-moz-user-select: none;">close</span></a></div><div id="cfjs-errorPopup" style="display: block;" class="cfjs-popup ui-dialog-content ui-widget-content"><div class="cfjs-popupSpinner cfjs-spinner" style="display: none;"></div><div class="cfjs-popupContent"><div id="cfjs-errorPopupMessage"><table><tbody><tr><td class="CFJS_ErrorText" id="cfjs-errorMessageImage"></td><td id="cfjs-errorMessageText"></td></tr></tbody></table></div><div class="CFJS_ButtonSet" id="cfjs-errorPopupButtons"><div id="cfjs-errorPopupButton" class="cfjs-button" tabindex="0" style="width: 55px;"><div class="cfjs-buttonLeft"></div><div class="cfjs-buttonContent" style="width: 35px;"></div><div class="cfjs-buttonRight"></div></div></div><div id="cfjs-errorPopupShowHideLink"><div class="show" id="cfjs-errorPopupShowHideExpander"></div><div id="cfjs-errorPopupShowHideLinkText">Show details</div></div><div id="cfjs-errorPopupShowHide" style="display: none;"><table class="CFJS_DataTable" id="cfjs-errorPopupTable"><tbody><tr id="cfjs-errorPopupDetailsRow"><td class="header">Details:</td><td class="value"><div></div></td></tr><tr id="cfjs-errorPopupCodeRow"><td class="header">Code:</td><td class="value"><div></div></td></tr><tr id="cfjs-errorPopupSourceRow"><td class="header">Source:</td><td class="value"><div></div></td></tr><tr id="cfjs-errorPopupCallStackRow"><td class="header">Call Stack:</td><td class="value"><div></div></td></tr><tr id="cfjs-errorPopupDateTimeRow"><td class="header">Date/Time:</td><td class="value"><div></div></td></tr><tr id="cfjs-errorPopupApplicationRow"><td class="header">Application:</td><td class="value"><div></div></td></tr><tr id="cfjs-errorPopupVersionRow"><td class="header">Version:</td><td class="value"><div></div></td></tr></tbody></table><p class="cfjs-errorPopupMessageAdditionalHelp">For additional help, please contact the Communication Center:<br>Agents or assistants, call 800-745-7375.<br>Alliance, Northwest Regional Office or Field Claims employees, call 866-213-4768.<br>COUNTRY Home Office employees, call extension 3278.</p></div></div></div></div><div style="display: none; z-index: 1000; outline: 0px none;" class="ui-dialog ui-widget ui-widget-content ui-corner-all  ui-draggable" tabindex="-1" role="dialog" aria-labelledby="ui-dialog-title-cfjs-overlayPopup"><div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" unselectable="on" style="-moz-user-select: none;"><span class="ui-dialog-title" id="ui-dialog-title-cfjs-overlayPopup" unselectable="on" style="-moz-user-select: none;">&nbsp;</span><a href="#" class="ui-dialog-titlebar-close ui-corner-all" role="button" unselectable="on" style="-moz-user-select: none;"><span class="ui-icon ui-icon-closethick" unselectable="on" style="-moz-user-select: none;">close</span></a></div><div id="cfjs-overlayPopup" style="display: block;" class="cfjs-popup ui-dialog-content ui-widget-content"><div class="cfjs-popupSpinner cfjs-spinner" style="display: none;"></div><div class="cfjs-popupContent"><div id="cfjs-overlaySpinnerContainer"><div id="cfjs-overlaySpinner" class="cfjs-spinner" style="display: block;"></div></div><div id="cfjs-overlayMessage"></div></div></div></div><div class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible" id="ui-datepicker-div" style=""><div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all"><a title="Prev" class="ui-datepicker-prev ui-corner-all ui-state-disabled"><span class="ui-icon ui-icon-circle-triangle-w">Prev</span></a><a title="Next" onclick="DP_jQuery_1310399292212.datepicker._adjustDate('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e', +1, 'M');" class="ui-datepicker-next ui-corner-all"><span class="ui-icon ui-icon-circle-triangle-e">Next</span></a><div class="ui-datepicker-title"><select onclick="DP_jQuery_1310399292212.datepicker._clickMonthYear('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e');" onchange="DP_jQuery_1310399292212.datepicker._selectMonthYear('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e', this, 'M');" class="ui-datepicker-month"><option selected="selected" value="6">Jul</option><option value="7">Aug</option><option value="8">Sep</option><option value="9">Oct</option><option value="10">Nov</option><option value="11">Dec</option></select><select onclick="DP_jQuery_1310399292212.datepicker._clickMonthYear('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e');" onchange="DP_jQuery_1310399292212.datepicker._selectMonthYear('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e', this, 'Y');" class="ui-datepicker-year"><option selected="selected" value="2011">2011</option><option value="2012">2012</option><option value="2013">2013</option><option value="2014">2014</option><option value="2015">2015</option><option value="2016">2016</option><option value="2017">2017</option><option value="2018">2018</option><option value="2019">2019</option><option value="2020">2020</option><option value="2021">2021</option></select></div></div><table class="ui-datepicker-calendar"><thead><tr><th class="ui-datepicker-week-end"><span title="Sunday">Su</span></th><th><span title="Monday">Mo</span></th><th><span title="Tuesday">Tu</span></th><th><span title="Wednesday">We</span></th><th><span title="Thursday">Th</span></th><th><span title="Friday">Fr</span></th><th class="ui-datepicker-week-end"><span title="Saturday">Sa</span></th></tr></thead><tbody><tr><td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">1</span></td><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">2</span></td></tr><tr><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">3</span></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">4</span></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">5</span></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">6</span></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">7</span></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">8</span></td><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">9</span></td></tr><tr><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">10</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" ui-datepicker-days-cell-over  ui-datepicker-current-day ui-datepicker-today"><a href="#" class="ui-state-default ui-state-highlight ui-state-active ui-state-hover">11</a></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">12</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">13</a></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">14</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">15</a></td><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">16</span></td></tr><tr><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">17</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">18</a></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">19</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">20</a></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">21</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">22</a></td><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">23</span></td></tr><tr><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">24</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">25</a></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">26</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">27</a></td><td class=" ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">28</span></td><td onclick="DP_jQuery_1310399292212.datepicker._selectDay('#nonTypeDate_5ebb7a82\-801e\-2b1b\-d756\-c4bb2f69971e',6,2011, this);return false;" class=" "><a href="#" class="ui-state-default">29</a></td><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">30</span></td></tr><tr><td class=" ui-datepicker-week-end ui-datepicker-unselectable ui-state-disabled "><span class="ui-state-default">31</span></td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td><td class=" ui-datepicker-week-end ui-datepicker-other-month ui-datepicker-unselectable ui-state-disabled">&nbsp;</td></tr></tbody></table></div><ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 1; top: 0px; left: 0px; display: none;"></ul></body>
</html>
